<template>
    <div>

        <el-form :model="form">

            <el-form-item label="名称" prop="sensorName">
                <el-input v-model="form.sensorName" disabled/>
            </el-form-item>

            <el-row :gutter="32">
                <el-col :lg="12">
                    <el-form-item label="图表" prop="chart">
                        <el-select v-model="form.chart"
                                   placeholder="请选择图表">
                            <el-option
                                v-for="item in chartList"
                                :key="item.componentName"
                                :label="item.name"
                                :value="item.componentName">
                            </el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
            </el-row>

        </el-form>

        <el-button @click="flag++">设置</el-button>

        <component :flag="flag" :is="form.chart" :params="form.chartParam" @transferData="transferData"></component>

    </div>
</template>

<script>

import {changeInfo} from '@/api/equipment/sensor'
import gauge from '@/views/common/chart/select/Gauge.vue'
import temperature from '@/views/common/chart/select/Temperature.vue'
import lcd from '@/views/common/chart/select/Lcd.vue'

export default {
    name: 'index',
    components: {
        gauge,
        temperature,
        lcd
    },
    props: {
        sensor: {
            type: Object
        }
    },
    data() {
        return {
            form: {},
            chartList: [
                {
                    'componentName': 'lcd',
                    'name': '默认',
                    'value': '0'
                },
                {
                    'componentName': 'gauge',
                    'name': '转速表1',
                    'value': '1'
                },
                {
                    'componentName': 'temperature',
                    'name': '温度计1',
                    'value': '2'
                }
            ],
            flag: 0
        }
    },
    created() {
        this.form = this.sensor
    },
    methods: {

        transferData(val) {
            let json = JSON.stringify(val)
            console.log('存储', json)

            let obj = {
                sensorId: this.form.sensorId,
                chart: this.form.chart,
                chartParam: json
            }
            changeInfo(obj).then(response => {
                this.$message.success('成功')
            })
        }
    }
}
</script>

<style scoped>

</style>
